import { Link, useParams } from "react-router-dom";
import "./VideoPageCard.css";

function VideoPageCard({ videoCards, BV }) {
  return (
    <div className="video-page-card">
      <div className="card-box">
        <div className="pic-box">
          <div className="pic">
            <Link to={`/video/${BV}`}>
              <img src={videoCards[BV].pic} alt="" />
            </Link>
          </div>
        </div>
        <div className="info">
          <Link to={`/video/${BV}`}>
            <span className="title">{videoCards[BV].title}</span>
          </Link>
          <div className="count up">
            {videoCards[BV].author}
          </div>
          <div className="count">
            {videoCards[BV].plays} 播放 · {videoCards[BV].danmakus} 弹幕
          </div>
        </div>
      </div>
    </div>
  );
}

export default VideoPageCard;